<template>
	<view>
		<view class="flex-col page">
			<view class="flex-col pd-b-90">
				<view class="flex-col section">
					<view class="flex-col self-stretch mt-41-5">
						<view class="flex-row items-center group">
							<view class="flex-col justify-start items-center image-wrapper">
								<image class="image_2"
									:src="wxuserInfo.avatarUrl ? wxuserInfo.avatarUrl : '/static/image/haoduogeni/avatar-default.png'" />
							</view>
							<view class="ml-12 flex-col items-start flex-1">
								<text v-if="wxuserInfo.nickName" class="text">{{ wxuserInfo.nickName }}</text>
								<text @click="toLogin" v-if="!wxuserInfo.nickName" class="text">登录</text>
							</view>
						</view>
						<view class="flex-row items-center section_4">
							<view class="flex-col flex-1">
								<view class="flex-row equal-division">
									<view class="flex-row items-center equal-division-item">
										<image class="image_3" src="@/static/image/haoduogeni/jifen-icon.png" />
										<text class="ml-4 font_2">积分</text>
									</view>
									<view class="flex-row items-center equal-division-item">
										<image class="image_3" src="@/static/image/haoduogeni/jinbi-icon.png" />
										<text class="ml-4 font_2">金币</text>
									</view>
								</view>
								<view class="flex-row group_2">
									<view class="font_4 flex-row justify-center" style="width: 188rpx;">
										{{userInfo.point ? userInfo.point : 0}}
									</view>
									<view class="font_4 text_6 flex-row justify-center" style="width: 188rpx;">
										{{userInfo.coin ? userInfo.coin : 0}}
									</view>
								</view>
							</view>
							<view class="shrink-0 section_5"></view>
							<view @click="recharge" class="flex-col justify-start items-center shrink-0 text-wrapper_2">
								<text class="font_3 text_5">立即充值</text>
							</view>
						</view>
						<view class="flex-row equal-division_2 group_3">
							<view @click="createPlan" class="flex-col items-center group_4 equal-division-item_2">
								<image class="image_4" src="@/static/image/haoduogeni/create-plan.png" />
								<text class="font_5 mt-9-5">创建计划</text>
							</view>
							<view @click="createAIPlan" class="flex-col items-center group_4 equal-division-item_2">
								<image class="image_4" src="@/static/image/haoduogeni/ai-plan.png" />
								<text class="font_5 mt-9-5">AI计划</text>
							</view>
							<view @click="toplanList" class="flex-col items-center group_4 equal-division-item_2">
								<image class="image_4" src="@/static/image/haoduogeni/plan-list.png" />
								<text class="font_5 mt-9-5">任务列表</text>
							</view>
							<view @click="toMore" class="flex-col items-center group_4 equal-division-item_2">
								<image class="image_4" src="@/static/image/haoduogeni/other-icon.png" />
								<text class="font_5 mt-9-5">其他功能</text>
							</view>
						</view>
					</view>
				</view>
				<view class="flex-col group_5" v-if="isBind">
					<view class="flex-row justify-between items-center group_6">
						<text class="text_7">账号列表</text>
						<view @click="addAccount" class="flex-row items-center">
							<image class="shrink-0 image_5" src="@/static/image/haoduogeni/add-account-green.png" />
							<text class="ml-4 text_8">添加账号</text>
						</view>
					</view>
					<view class="flex-col mt-15-5">
						<view class="flex-col mt-10 list-item section_6" v-for="(item,index) in wxList" :key="index">
							<view class="flex-row justify-between items-center ">
								<view class="flex-row items-end">
									<image class="image_6"
										:src="item.wx_user == '' ? '/static/image/haoduogeni/avatar-default.png' : replaceHttp(item.wx_user.HeadUrl)" />
									<view class="flex-col ml-7-5">
										<text
											class="font_66">{{item.wx_user == '' ? '--' : item.wx_user.NickName}}</text>
										<view class="mt-10-5">
											<text class="font1">到期时间: </text>
											<text class="font1">{{item.wx_user == '' ? '--' : item.end_time}}</text>
										</view>
										<view v-if="item.wx_user == ''" class="flex-row items-center mt-10-5">
											<image class="image_7" src="@/static/image/haoduogeni/zaixian-icon.png" />
											<text class="font text_10 ml-4-5">待绑定</text>
										</view>
										<view v-if="item.wx_user != '' && item.wx_user.is_login == 1"
											class="flex-row items-center mt-10-5">
											<image class="image_7" src="@/static/image/haoduogeni/zaixian-icon.png" />
											<text class="font text_10 ml-4-5">在线</text>
										</view>
										<view v-if="item.wx_user != '' && item.wx_user.is_login == 0"
											class="flex-row items-center mt-10-5">
											<image class="image_7" src="@/static/image/haoduogeni/lixian-icon.png" />
											<text class="font1 text_10 ml-4-5">离线</text>
										</view>
									</view>
								</view>
								<view style="display: flex;flex-direction: column;">
									<view @click="toBindWxUser(item.id)" v-if="item.wx_user == ''"
										class="flex-col justify-start items-center text-wrapper_3">
										<text class="font_3 text_9">绑定</text>
									</view>
									<view @click="toTongbuUser(item.id)" v-if="item.wx_user == ''"
										class="flex-col justify-start items-center text-wrapper_6">
										<text class="font_33 text_9">同步</text>
									</view>
									<view @click="loginOut(item.wx_user.Wxid)"
										v-if="item.wx_user != '' && item.wx_user.is_login == 1"
										class="flex-col justify-start items-center text-wrapper_5">
										<text class="font_3 text_9">退出登录</text>
									</view>
									<view @click="toBindWxUserReset(item)"
										v-if="item.wx_user != '' && item.wx_user.is_login == 0"
										class="flex-col justify-start items-center text-wrapper_4">
										<text class="font_3 text_9">重新登录</text>
									</view>
									<view @click="toUpdateEndTime(item.id)" v-if="item.wx_user != ''"
										class="flex-col justify-start items-center text-wrapper_66">
										<text class="font_34 text_9">续期</text>
									</view>
									<view @click="toDelBindUser(item.id)" v-if="item.wx_user != ''"
										class="flex-col justify-start items-center text-wrapper_6">
										<text class="font_33 text_9">清除绑定</text>
									</view>
								</view>

							</view>
							<view @click="toFriendCicle(item.wx_uid)" class="flex-col" v-if="item.wx_user != ''">
								<image class="self-start image_8 image_10"
									src="@/static/image/haoduogeni/faquan-record.png" />
								<text class="self-start font_7 text_14">发圈记录</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="isBind" class="flex-col justify-start section_7">
				<view @click="addAccount" class="flex-row justify-center items-center section_8">
					<image class="image_5" src="@/static/image/haoduogeni/add-account-blue.png" />
					<text class="font_6 text_15 ml-7-5">添加账号</text>
				</view>
			</view>
		</view>
		<!-- 登录弹窗 -->
		<ns-login ref="login" @loginSuccess="loginSuccess"></ns-login>
		<buyCard :openid="openid" ref="buycard" @closeShow="closeShowBuyCard" @confirm="confirm"></buyCard>
		<recharge :openid="openid" v-if="rechargeShow" :show="rechargeShow" @closeShow="closeRechargeShow"
			@confirm="confirmRecharge"></recharge>
		<bindMobile v-if="bindUserShow" :show="bindUserShow" @closeShow="closeBindUserShow" @confirm="toBindUser">
		</bindMobile>
		<syncUserPop :show="syncUserShow" @closeShow="closeSyncUserShow" @confirm="toSyncUser"></syncUserPop>
		<updateEndTime :show="updateEndTimeShow" @closeShow="closeUpdateEndTimeShow" @confirm="confirmUpdateEndTime">
		</updateEndTime>

	</view>
</template>

<script>
	import nsLogin from "../../components/ns-login/ns-login.vue";
	import buyCard from "../components/buyCard/index.vue";
	import bindMobile from "../components/bindMobile/index.vue";
	import recharge from "../components/recharge/index.vue";
	import syncUserPop from "../components/syncUser/index.vue";
	import updateEndTime from "../components/updateEndTime/index.vue";
	import {
		bindWxUser,
		getstatus,
		getZhuUser,
		getOpenid,
		getWxUser,
		getConfig,
		getUserStatus,
		delBindUser,
		createOrder,
		syncUser,
		xuqi
	} from '../../haoduogeni/common/api/user';
	import {
		LogOut,
		getWxUserStatus
	} from '../../haoduogeni/common/api/send';
	import {
		getUserinfo,
	} from "@/api/user.js"

	export default {
		components: {
			nsLogin,
			buyCard,
			bindMobile,
			recharge,
			syncUserPop,
			updateEndTime
		},
		filters: {

		},
		data() {
			return {
				wxList: [],
				buyCradShow: false,
				isVip: true,
				rechargeShow: false,
				userInfo: {},
				bindUserShow: false,
				openid: '',
				wxuserInfo: {},
				page: 1,
				row: 10,
				uid: '',
				isBind: false,
				last_page: 1,
				syncUserShow: false,
				syncUserId: '', //同步用户id
				updateEndTimeShow: false,
				updateEndTimeId: '', //续期用户id
			}
		},
		onLoad(options) {
			if (!uni.getStorageSync('userId')) {
				uni.showToast({
					title: '登录体验完整功能',
					icon: 'none',
					duration: 1000
				})
				return

			}
			this.getWxUserInfo();
			this.page = 1;
			this.wxList = [];
			this.getWxList();
			this.getConfigInfo();

		},
		methods: {
			getConfigInfo(){
				getConfig({
					pt_id: this.$ptId
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getConfig')
					var data = res.data;
					if (res.errno == 0) {
						if (data.type == 2) {
							//用户版
				
							this.getStatusUser(data.z_uid);
						} else {
							this.getStatus();
						}
					} else {
				
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			replaceHttp(originalUrl) {
				var secureUrl = originalUrl.replace('http://', 'https://');
				return secureUrl;
			},
			toFriendCicle(id) {
				uni.navigateTo({
					url: '/haoduogeni/friendCicle/index?id=' + id,
				})
			},
			loginOut(wxid) {
				console.log(wxid, 'eeeeeeeeeeeeeee')
				var wxid = wxid;
				var _this = this;
				uni.showModal({
					title: '提示', //提示的标题
					content: '确认退出登录么？', //提示的内容
					confirmText: '确定', //确认按钮的文字，最多 4 个字符
					cancelText: '取消', // 取消按钮的文字，最多 4 个字符
					success(res) {
						if (res.confirm) {
							// 用户点击确定后的操作 
							_this.loginoutsecond(wxid);
						} else {
							// 用户取消后的操作
						}
					}
				})


			},

			loginoutsecond(wxid) {
				var _this = this;
				LogOut({
					wxid: wxid
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getWxUser')
					if (res.errno == 0) {
						this.page = 1;
						this.wxList = [];
						this.getWxList()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			getWxUserInfo() {
				getUserinfo({
					uid: uni.getStorageSync("userId")
				}).then(res => {
					console.log(res.data, 'getUserinfo')
					this.wxuserInfo = res.data;
				}).catch(err => {

				})

			},
			addAccount() {
				this.openid = this.userInfo.openid;
				// this.buyCradShow = true;
				this.$refs.buycard.open();
				// this.buyNow();

			},
			buyNow() {
				if (this.isLoading) {
					uni.showToast({
						title: '请勿重复点击',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					title: '加载中',
				})
				this.isLoading = true;
				var _this = this;
				createOrder({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId'),
					type: 3, // 1充值积分2充值金币3购买套餐
					taocan_id: 33,
					pay_type: 2, //1微信支付2金币支付 （只有买套餐有金币支付）
					openid: this.openid
				}).then(res => {
					//成功时回调函数
					console.log(res.errno, 'getCodeList')
					if (res.errno == 0) {
						var payInfo = res.data.payInfo;

						wx.showToast({
							title: '购买成功',
							icon: 'none'
						})
						this.isLoading = false;
						uni.hideLoading();
						this.page = 1;
						this.wxList = [];
						_this.getWxList();
						// _this.triggerEvent("confirm");
						// _this.setData({
						//   show: false
						// });

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						this.isLoading = false;
						uni.hideLoading();
					}
					// var payInfo = {
					//   appId: "wx3faa28fc6e94b17a",
					//   timestamp: "1754981691",
					//   nonceStr: "0ta2iapnv6w3kj51d2sqvmjxnxwe4q0e",
					//   package: "prepay_id=wx121454516049247774a73990d1abb40000",
					//   signType: "MD5",
					//   paySign: "8720FAA04BCC526F6C58E775B16DAF70",
					//   timestamp: "1754981691"
					// };
					// this.wechatPay(payInfo)
				}).catch(err => {
					//失败时回调函数
					console.log(err)
					this.isLoading = false;
					uni.hideLoading();
				})
			},
			toTongbuUser(id) {
				this.syncUserShow = true;
				this.syncUserId = id;
			},

			toBindWxUser(id) {
				var uid = this.uid;
				wx.navigateTo({
					url: '/haoduogeni/addAccount/index?uid=' + uid + '&id=' + id,
				})
			},
			toUpdateEndTime(id) {
				this.updateEndTimeShow = true;
				this.updateEndTimeId = id;
			},
			confirmUpdateEndTime(data) {
				if (this.isLoading) {
					uni.showToast({
						title: '请勿重复点击',
						icon: 'none'
					})
					return
				}
				this.isLoading = true;
				uni.showLoading({
					title: '加载中',
				})
				const day = data;
				console.log(this.updateEndTimeId, 'this.data.updateEndTimeId')
				xuqi({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId'),
					id: this.updateEndTimeId,
					day: day
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getstatus')
					if (res.errno == 0) {
						this.isLoading = false;
						uni.hideLoading();
						uni.showToast({
							title: '续期成功',
							icon: 'none'
						})
						this.updateEndTimeShow = false;
						this.page = 1;
						this.wxList = [];
						this.updateEndTimeId = '';
						this.getWxList();
					} else {
						this.isLoading = false;
						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})

					}
				}).catch(err => {
					this.isLoading = false;
					uni.hideLoading();
					//失败时回调函数
					console.log(err)
				})
			},
			toBindWxUserReset(item) {

				var obj = {
					id: item.id,
					uid: this.uid,
					DeviceId: item.wx_user.DeviceId,
					address: item.wx_user.address,
					login_type: item.wx_user.login_type,
					notes: item.wx_user.notes
				}
				wx.navigateTo({
					url: '/haoduogeni/addAccount/index?obj=' + JSON.stringify(obj),
				})
			},
			toDelBindUser(id) {
				// console.log(e.currentTarget.dataset.id, 'eeeeeeeeeeeeeee')
				// var id = e.currentTarget.dataset.id;
				var _this = this;
				uni.showModal({
					title: '提示', //提示的标题
					content: '确认清除绑定么？', //提示的内容
					confirmText: '确定', //确认按钮的文字，最多 4 个字符
					cancelText: '取消', // 取消按钮的文字，最多 4 个字符
					success(res) {
						if (res.confirm) {
							// 用户点击确定后的操作 
							_this.toDelBindUserSecond(id);
						} else {
							// 用户取消后的操作
						}
					}
				})
			},
			// 清除绑定
			toDelBindUserSecond(id) {
				delBindUser({
					pt_id: this.$ptId,
					id: id
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getWxUser')
					if (res.errno == 0) {
						uni.showToast({
							title: '清除绑定成功',
							icon: 'none'
						})
						this.page = 1;
						this.wxList = [];
						this.getWxList()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			recharge() {
				if (!uni.getStorageSync('userId')) {
					uni.showToast({
						title: '登录体验完整功能',
						icon: 'none',
						duration: 1000
					})
					return
				}
				this.rechargeShow = true;
			},
			getWxList() {
				getWxUser({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId'),
					page: this.page,
					row: this.row
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getWxUser')
					if (res.errno == 0) {
						var data = res.data.data;
						this.wxList = [...this.wxList, ...data];
						this.last_page = res.data.last_page;
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})

			},
			// 检测登录状态
			getLoginStatus() {
				getWxUserStatus({
					uid: this.uid
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getZhuUser')
					if (res.errno == 0) {
						this.page = 1;
						this.wxList = [];
						this.getWxList()
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			getCoin() {
				getZhuUser({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId')
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getZhuUser')
					if (res.errno == 0) {
						this.userInfo = res.data;
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			getUserInfo() {
				getZhuUser({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId')
				}).then(res => {
					//成功时回调函数
					console.log(res, !res.openid, 'getZhuUser111111')
					if (res.errno == 0) {
						this.userInfo = res.data;
						if (!res.data.openid) {
							this.isBind = false;
							this.getWxLogin()
						} else {
							this.isBind = true;

						}
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			//同步会员
			toSyncUser(data) {
				if (this.isLoading) {
					uni.showToast({
						title: '请勿重复点击',
						icon: 'none'
					})
					return
				}
				this.isLoading = true;
				uni.showLoading({
					title: '加载中',
				})
				const mobile = data;
				syncUser({
					pt_id: this.$ptId,
					id: this.syncUserId,
					tel: mobile
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getstatus')
					if (res.errno == 0) {
						this.isLoading = false;
						uni.hideLoading();
						uni.showToast({
							title: '同步成功',
							icon: 'none'
						})

						this.syncUserShow = false;
						this.page = 1;
						this.wxList = [];
						this.syncUserId = '';

						this.getWxList();
					} else {

						this.isLoading = false;

						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})

					}
				}).catch(err => {
					this.isLoading = false;
					uni.hideLoading();
					//失败时回调函数
					console.log(err)
				})
			},
			toBindUser(data) {
				console.log(data, 'datatata')
				const mobile = data;
				bindWxUser({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId'),
					tel: mobile
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getstatus')
					if (res.errno == 0) {

						this.userInfo = res.data;
						this.bindUserShow = false;

						this.getWxLogin();
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			toLogin() {
				uni.navigateTo({
					url: '/pages/login/login',
				})
			},
			getStatusUser(uid) {
				getUserStatus({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId')
				}).then(res => {
					if (res.errno == 0) {
						this.getUserInfo();
						this.uid = uid;
						this.getLoginStatus()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			getStatus() {
				getstatus({
					pt_id: this.$ptId,
					uid: uni.getStorageSync('userId')
				}).then(res => {
					//成功时回调函数
					console.log(res, 'getstatus')
					if (res.errno == 0) {
						this.getUserInfo();
						this.uid = res.data.uid;
						this.getLoginStatus();
					} else {
						this.bindUserShow = true;
					}
				}).catch(err => {
					//失败时回调函数
					console.log(err)
				})
			},
			getWxLogin() {
				var _this = this;
				// #ifdef MP-WEIXIN
				uni.login({
					success: function(a) {
						console.log(a, 'aaaaaaa')
						_this.getOpenIdNew(a.code)
					}
				})
				// #endif
				
			},
			confirm() {
				this.page = 1;
				this.wxList = [];
				this.buyCradShow = false;
				this.getWxList();
				this.getCoin();
			},
			confirmRecharge() {
				// this.getUserInfo()
				this.getCoin();
			},
			getOpenIdNew(code) {
				var _this = this;
				getOpenid({
					pt_id: this.$ptId,
					code: code,
					uid: uni.getStorageSync('userId')
				}).then(res => {
					if (res.errno == 0) {
						this.isBind = true;
						this.page = 1;
						this.wxList = [];
						this.getWxList();
						this.getCoin();
					}
				}).catch(err => {
					console.log(err)
				})
			},
			closeBindUserShow() {
				this.bindUserShow = false;
			},
			closeSyncUserShow() {
				this.syncUserShow = false;
			},
			closeUpdateEndTimeShow() {
				this.updateEndTimeShow = false;
			},
			createPlan() {
				if (!uni.getStorageSync('userId')) {
					uni.showToast({
						title: '登录体验完整功能',
						icon: 'none'
					})
					return
				}

				uni.navigateTo({
					url: '/haoduogeni/createPlan/index?uid=' + this.uid,
				})
			},
			createAIPlan() {
				if (!uni.getStorageSync('userId')) {
					uni.showToast({
						title: '登录体验完整功能',
						icon: 'none'
					})
					return
				}
				uni.navigateTo({
					url: '/haoduogeni/createAIPlan/index?uid=' + this.uid,
				})
			},
			toplanList() {
				if (!uni.getStorageSync('userId')) {
					uni.showToast({
						title: '登录体验完整功能',
						icon: 'none'
					})
					return
				}
				uni.navigateTo({
					url: '/haoduogeni/planList/index?uid=' + this.uid,
				})
			},
			toMore() {
				uni.showToast({
					title: '开发中',
					icon: 'none'
				})
			},
			closeShowBuyCard() {
				this.buyCardShow = false;
			},
			closeRechargeShow() {
				this.rechargeShow = false;
			},
		}
	}
</script>

<style lang="less">
	.u-drawer-bottom {
		background: rgba(0, 0, 0, 0) !important;
		background-color: rgba(0, 0, 0, 0) !important;

	}

	@import url("../common/css/common.css");

	.mt-41-5 {
		margin-top: 83rpx;
	}

	.mt-13 {
		margin-top: 26rpx;
	}

	.ml-44-5 {
		margin-left: 89rpx;
	}

	.mt-9-5 {
		margin-top: 19rpx;
	}

	.mt-15-5 {
		margin-top: 31rpx;
	}

	.mt-10-5 {
		margin-top: 21rpx;
	}

	.ml-4-5 {
		margin-left: 9rpx;
	}

	.ml-7-5 {
		margin-left: 15rpx;
	}

	.pd-b-90 {
		padding-bottom: 180rpx;
	}

	.page {
		background-color: #ffffff;
		width: 100%;
		/* overflow-y: auto;
	  overflow-x: hidden; */
		height: 100%;
	}

	.section {
		padding: 30rpx 0 35rpx;
		/* padding: 0rpx 0 35rpx; */
		background-image: url('https://jianji.axu9.com/friendCircleImg/mine-bg.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.image {
		margin-right: 30rpx;
		width: 655rpx;
		height: 24rpx;
	}

	.group {
		padding: 0 36rpx 40rpx;
	}

	.image-wrapper {
		/* background-image: url('https://ide.code.fun/api/image?token=689552fdd26a7d0011a60701&name=7a46644c6e798823092842f9182a6f20.png'); */
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 100rpx;
		height: 100rpx;
	}

	.image_2 {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
	}

	.text {
		color: #000000;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 31rpx;
	}

	.section_2 {
		padding: 4rpx 12rpx;
		background-color: #ffffffc4;
		border-radius: 18rpx;
		width: 279rpx;
		border-left: solid 1rpx #ffffff;
		border-right: solid 1rpx #ffffff;
		border-top: solid 1rpx #ffffff;
		border-bottom: solid 1rpx #ffffff;
	}

	.section_3 {
		padding: 4rpx 0;
		/* background-image: url('https://ide.code.fun/api/image?token=689552fdd26a7d0011a60701&name=5dc3314fd862104dbdeec8664de77675.png'); */
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 27rpx;
		height: 29rpx;
	}

	.text-wrapper {
		padding: 4rpx 0;
		/* background-image: url('https://ide.code.fun/api/image?token=689552fdd26a7d0011a60701&name=4e415cf42a3eaf89f397f14f65e6559d.png'); */
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 21rpx;
	}

	.text_4 {
		color: #ffffff;
		font-size: 16rpx;
		font-family: Douyin Sans;
		font-weight: 700;
		line-height: 13rpx;
	}

	.text_2 {
		color: #01af84;
		font-size: 20rpx;
		font-family: PingFang SC;
		line-height: 19rpx;
	}

	.font {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		color: #22dd85;
	}

	.font1 {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		color: #7b7b7b;
	}

	.text_3 {
		color: #01af84;
		line-height: 17rpx;
	}

	.section_4 {
		margin: 0 30rpx;
		padding: 17rpx 10rpx 21rpx;
		background-image: url('https://jianji.axu9.com/friendCircleImg/mine-to-bg.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.equal-division {
		padding: 0 2rpx 8rpx;
		/* border-bottom: solid 1rpx #4d5367; */
	}

	.equal-division-item {
		padding: 10rpx 0;
		width: 188rpx;
	}

	.image_3 {
		margin-left: 55rpx;
		width: 25.8rpx;
		height: 26rpx;
	}

	.font_2 {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 21rpx;
		color: #ffffff;
	}

	.group_2 {
		/* padding: 25rpx 82rpx 0; */

	}

	.font_4 {
		font-size: 30rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		font-weight: 700;
		color: #ffffff;
	}

	.text_6 {
		margin-right: 80rpx;
	}

	.section_5 {
		margin-left: 3rpx;
		background-image: linear-gradient(0deg, #383d50 0%, #faf3d6 49%, #383d50 100%);
		width: 1rpx;
		height: 100rpx;
	}

	.text-wrapper_2 {
		margin-left: 30rpx;
		margin-right: 26rpx;
		padding: 13rpx 0;
		background-color: #faf3d6;
		border-radius: 24rpx;
		width: 140rpx;
		height: 48rpx;
	}

	.font_33 {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		font-weight: 500;
		color: #01af84;
	}

	.font_3 {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		font-weight: 500;
		color: #ffffff;
	}

	.text_5 {
		color: #806a42;
		line-height: 22rpx;
	}

	.equal-division_2 {
		margin-top: 30rpx;
	}

	.group_3 {
		padding: 0 36rpx;
	}

	.group_4 {
		flex: 1 1 168.66rpx;
	}

	.equal-division-item_2 {
		padding: 12rpx 0;
	}

	.image_4 {
		width: 64rpx;
		height: 64rpx;
	}

	.font_5 {
		font-size: 24rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		color: #000000;
	}

	.group_5 {
		padding: 27rpx 30rpx 0;
	}

	.group_6 {
		padding-left: 3rpx;
	}

	.text_7 {
		color: #000000;
		font-size: 34rpx;
		font-family: PingFang SC;
		line-height: 32rpx;
	}

	.image_5 {
		width: 36rpx;
		height: 36rpx;
	}

	.text_8 {
		color: #000000;
		font-size: 26rpx;
		font-family: PingFang SC;
		line-height: 25rpx;
	}

	.list-item {
		padding: 26rpx 30rpx;
		background-color: #fafafa;
		border-radius: 20rpx;
	}

	.list-item:first-child {
		margin-top: 0;
	}

	.section_6 {
		padding: 26rpx 30rpx 29rpx;
		background-color: #fafafa;
		border-radius: 20rpx;
	}

	.image_6 {
		margin-bottom: 7rpx;
		width: 80rpx;
		height: 80rpx;
		border-radius: 50%;
	}

	.font_6 {
		font-size: 28rpx;
		font-family: PingFang SC;
		line-height: 26rpx;
		font-weight: 500;
		color: #000000;
	}

	.font_66 {
		font-size: 28rpx;
		font-family: PingFang SC;
		/* line-height: 26rpx; */
		font-weight: 500;
		color: #000000;
		width: 80%;
		word-break: break-all;
	}

	.image_7 {
		width: 12rpx;
		height: 12rpx;
	}

	.text_10 {
		line-height: 22rpx;
	}

	.text-wrapper_3 {
		margin-right: 11rpx;
		padding: 13rpx 0;
		background-image: linear-gradient(90deg, #00ceb8 0%, #0fcd99 100%);
		border-radius: 24rpx;
		width: 160rpx;
		height: 48rpx;
	}

	.text-wrapper_4 {
		margin-right: 11rpx;
		padding: 13rpx 0;
		background-image: linear-gradient(0deg, #ff5959 0%, #ff6058 100%);
		border-radius: 24rpx;
		width: 160rpx;
		height: 48rpx;
	}

	.text-wrapper_5 {
		margin-right: 11rpx;
		padding: 13rpx 0;
		background-image: linear-gradient(0deg, #ffa50d 0%, #ffa50d 100%);
		border-radius: 24rpx;
		width: 160rpx;
		height: 48rpx;
	}

	.text-wrapper_6 {
		margin-right: 11rpx;
		padding: 13rpx 0;
		background-image: linear-gradient(90deg, #d8f6f1 0%, #d8f6f1 100%);
		border-radius: 24rpx;
		width: 160rpx;
		height: 48rpx;
		margin-top: 20rpx;
		color: #01af84;
	}

	.text-wrapper_66 {
		margin-right: 11rpx;
		padding: 13rpx 0;
		background-image: linear-gradient(90deg, #d8f6f1 0%, #d8f6f1 100%);
		border-radius: 24rpx;
		width: 160rpx;
		height: 48rpx;
		margin-top: 20rpx;
		color: #01af84;
	}

	.font_34 {
		font-size: 22rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		font-weight: 500;
		color: #01af84;
	}

	.text_9 {
		line-height: 22rpx;
	}

	.section_7 {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		padding: 32rpx 20rpx 32rpx;
		background-color: #ffffff;
		box-shadow: 0rpx -4rpx 24.04rpx 2.98rpx #d4d4d430;
	}

	.section_8 {
		/* margin-left: 30rpx;
	  margin-right: 17rpx; */
		padding: 22rpx 0;
		background-image: linear-gradient(90deg, #00ceb8 0%, #0fcd99 100%);
		border-radius: 12rpx;
	}

	.text_15 {
		color: #ffffff;
	}

	.image_8 {
		width: 56rpx;
		height: 56rpx;
	}

	.image_10 {
		margin-left: 32rpx;
		margin-top: 27rpx;
	}

	.font_7 {
		font-size: 24rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		color: #7b7b7b;
	}

	.text_14 {
		margin-left: 13rpx;
		margin-top: 16rpx;
	}
</style>